<template>
  <div>
    <el-row>
      <el-col :span="12" :offset="6">
        <el-carousel indicator-position="outside" height="534px">
          <el-carousel-item v-for="item in images" :key="item" >
            <el-image
              :src="item"
              fit="fill"></el-image>
          </el-carousel-item>
        </el-carousel>
      </el-col>
    </el-row>
  </div>
</template>

<script>
import image1 from '../assets/IndexImages/1.jpeg';
import image2 from '../assets/IndexImages/2.jpeg';
import image3 from '../assets/IndexImages/3.jpeg';
import image4 from '../assets/IndexImages/4.jpeg';
import image5 from '../assets/IndexImages/5.jpeg';
import image6 from '../assets/IndexImages/6.jpeg';
import image7 from '../assets/IndexImages/7.jpeg';

export default {
  name: "Index",
  data() {
    return {
      images: [image1,image2,image3,image4,image5,image6,image7]
    }
  }

}
</script>

<style scoped>

</style>
